<template>
<div>
   <h1>Child组件</h1>
   {{msg}}
   <button @click="sendMsgToParent">给父组件发消息</button>
</div>
</template>

<script>
import { defineComponent ,reactive,ref,toRefs} from 'vue'
import {useRouter} from 'vue-router'

export default defineComponent({
    name:'Child',
    // props接受的数据不能直接修改
    props:{
        msg:{
            // 定义数据类型
            type:String,
            required:true,
            default:"xxx" // 和required 互斥
        }
    },
    setup(props,ctx) {
     console.log(props.msg)
     let sendMsgToParent = ()=>{
        //  ctx.emit('send',"Child 组件的消息")
        // ctx.emit('send',['a',10,{a:'111'}])
        ctx.emit('send',{hello:"h"})
     }
     return {
         sendMsgToParent
     }
    },
})
</script>
